<div class="template-7" layout="row" layout-align="space-between">
    <div class="info" layout="column" layout-align="space-between" layout-fill flex>
        <div class="p-16">
            <div class="title h1" ng-if="card.title">
                {{card.title}}
            </div>

            <div class="subtitle h4 secondary-text" ng-if="card.subtitle">
                {{card.subtitle}}
            </div>

            <div class="text h4 pt-8" ng-if="card.text">
                {{card.text}}
            </div>
        </div>

        <div>
            <md-divider></md-divider>
            <div class="p-8" layout="row">
                <md-icon md-font-icon="icon-star-outline" class="mh-5"></md-icon>
                <md-icon md-font-icon="icon-star-outline" class="mh-5"></md-icon>
                <md-icon md-font-icon="icon-star-outline" class="mh-5"></md-icon>
                <md-icon md-font-icon="icon-star-outline" class="mh-5"></md-icon>
                <md-icon md-font-icon="icon-star-outline" class="mh-5"></md-icon>
            </div>
        </div>
    </div>

    <div class="media">
        <img class="image" ng-src="{{card.media.image.src}}" alt="{{card.media.image.alt}}" ng-show="card.media.image">
    </div>
</div>